<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
	<title>首页</title>
	<!-- 公共的js文件 -->
	<script src="public/js/flexible.js"></script>
	<link href="public/images/mlogo.ico" rel="shortcut icon">
	<link rel="stylesheet" href="public/css/reset.css">
	<link rel="stylesheet" href="public/css/common.css">
	<link rel="stylesheet" href="public/css/index.css">
</head>
<body>
	<!-- 绝对定位 -->
	<!-- 顶部（公共的部分） -->
	<header class="head clearfix">
		<!-- logo -->
		<div class="head-logo">
			<a href="index.html" class="logo">
				<img src="public/images/logo.png" alt="题海" title="题海">
			</a>
		</div>
		<!-- 搜索栏 -->
		<div class="head-search">
			<form action="">
				<!-- 搜索栏组件 -->
				<div class="search-group">
					<input class="search-input" type="text" placeholder="请输入搜索关键词">
					<button class="search-btn" type="submit"></button>
				</div>
			</form>
		</div>
	</header>
	<!-- 主体，放网页的主要内容 -->
	<div class="content">
		<!-- 轮播采用css3的3D旋转 -->
        <div class="banner">
        	<div>
        		<!-- 图片 -->
	        	<div class="banner-imggroup">
	        		<div class="imggroup-item">
	        			<a class="" href="">
	        				<img src="public/images/banner/1.jpg" alt="">
	        			</a>
	        		</div>
	        		<div class="imggroup-item">
	        			<a class="" href="">
	        				<img src="public/images/banner/2.jpg" alt="">
	        			</a>
	        		</div>
	        		<div class="imggroup-item">
	        			<a class="" href="">
	        				<img src="public/images/banner/3.jpg" alt="">
	        			</a>
	        		</div>
	        		<div class="imggroup-item">
	        			<a class="" href="">
	        				<img src="public/images/banner/1.jpg" alt="">
	        			</a>
	        		</div>
	        		<div class="imggroup-item">
	        			<a class="" href="">
	        				<img src="public/images/banner/2.jpg" alt="">
	        			</a>
	        		</div>
	        		<div class=imggroup-item"">
	        			<a class="" href="">
	        				<img src="public/images/banner/3.jpg" alt="">
	        			</a>
	        		</div>
	        	</div>
	        	<!-- 显示按钮 -->
	        	<div class="banner-pagination">
	        		<span class="banner-pagination-item active"></span>
	        		<span class="banner-pagination-item"></span>
	        		<span class="banner-pagination-item"></span>
	        		<span class="banner-pagination-item"></span>
	        		<span class="banner-pagination-item"></span>
	        		<span class="banner-pagination-item"></span>
	        	</div>
        	</div>
        </div>
        <!-- 导航菜单 -->
        <div class=""></div>
        <!-- 热门话题 -->
        <div class=""></div>
        <!-- 热门笔记 -->
        <div class=""></div>
        <!-- 热门提问 -->
        <div class=""></div>
	</div>
	<!-- 绝对定位 -->
	<!-- 底部导航栏，模拟华为手机按钮（公共的部分） -->
	<footer class="foot">
		<nav class="foot-nav">
			<ul class="clearfix">
				<li class="foot-nav-list">
					<a class="active" href="index.html">
						<i class="icon home2"></i>
						<span>首页</span>
					</a>
				</li>
				<li class="foot-nav-list">
					<a href="note/note.html">
						<i class="icon note"></i>
						<span>笔记</span>
					</a>
				</li>
				<li class="foot-nav-list">
					<a href="issue/issue.html">
						<i class="icon issue"></i>
						<span>问答</span>
					</a>
				</li>
				<li class="foot-nav-list">
					<a href="exercises/exercises.html">
						<i class="icon exercises"></i>
						<span>习题</span>
					</a>
				</li>
				<li class="foot-nav-list">
					<a href="user/user.html">
						<i class="icon myuser"></i>
						<span>我的</span>
					</a>
				</li>
			</ul>
		</nav>
	</footer>
</body>
</html>